/** * 知识店铺 *  * .
*/
<style lang="less" scoped>
page {
	font-size: 31upx;
	font-family: SimHei;
}
// 确认订单
// .qrdd {
// 	height: 100upx;
// 	background-color: #fff;
// 	text-align: center;
// 	line-height: 100upx;
// 	text {
// 		font-size: 32upx;
// 		font-weight: 700;
// 		color: #000;
// 	}
// }

// 添加地址
.address {
	height: 96upx;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 20upx 0;
	margin-bottom: 20upx;
	view {
		text {
			font-size: 30upx;
			color: #666;
		}
		image {
			width: 14upx;
			height: 24upx;
			position: absolute;
			right: 20upx;
		}
	}
	.shrinfo {
		view {
			margin-top: 10upx;
		}
		&-box1 {
			display: flex;
			align-items: center;
			justify-content: space-around;
		}
	}
}

// 订单内容
.dd-content {
	font-size: 31upx;
	&-item {
		height: 180upx;
		background-color: #fff;
		padding: 0 20upx;
		border-bottom: 2upx solid #e5e5e5;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		.item-left {
			width: 128upx;
			height: 128upx;
		}
		.item-right {
			width: 550upx;
			height: 124upx;
			margin-left: 24upx;
			&-top {
				font-size: 28upx;
				color: #414141;
				display: flex;
				justify-content: space-between;
			}
			&-center {
				margin-top: 10upx;
				font-size: 28upx;
				color: #414141;
				display: flex;
				justify-content: space-between;
			}
			&-bottom {
				font-size: 25upx;
				color: #999;
				margin-top: 25upx;
				text-align: right;
			}
		}
	}
	.promotion-code {
		font-size: 31upx;
		height: 90upx;
		background-color: #fff;
		border-bottom: 2upx solid #e5e5e5;
		padding: 0 30upx;
		box-sizing: border-box;
		align-items: center;
		display: flex;
		justify-content: space-between;
		view {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;
			text {
				color: #333;
			}
			input {
				height: 50upx;
				text-align: center;
			}
		}
	}
	.freight {
		font-size: 31upx;
		height: 90upx;
		background-color: #fff;
		border-bottom: 2upx solid #e5e5e5;
		padding: 0 35upx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
		text {
			color: #333;
		}
	}
}

// 订单备注
.ddbz {
	font-size: 31upx;
	margin-top: 20upx;
	height: 150upx;
	background-color: #fff;
	padding: 0 35upx;
	padding-top: 20upx;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	text {
		color: #333;
	}
	textarea {
		width: 100%;
		height: 120upx;
		// background-color: orange;
		margin-top: 20upx;
	}
}

// 支付方式
.zffs {
	padding: 0 30upx;
	margin-top: 20upx;
	font-size: 31upx;
	background-color: #fff;
	margin-bottom: 150rpx;
	.zhifu-mode {
		font-size: 31upx;
		height: 70upx;
		border-bottom: 2upx solid #e5e5e5;
		line-height: 70upx;
		text {
			color: #333;
		}
	}
	.zhifubao {
		padding: 30upx 25upx;
		border-bottom: 2upx solid #e5e5e5;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.weixin-center {
			display: flex;
			align-items: center;
			justify-content: center;
			image {
				width: 54upx;
				height: 54upx;
			}
			text {
				margin-left: 15upx;
				font-size: 28upx;
				color: #666;
			}
		}
		.radio {
		}
	}
}

// 支付
.pay {
	width: 100%;
	padding: 25upx 30upx;
	box-sizing: border-box;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	position: fixed;
	left: 0;
	bottom: 0;
	font-size: 30upx;
	text:nth-child(1) {
		color: #a7a7a7;
	}
	text:nth-child(2) {
		color: #000;
	}
	button {
		height: 68upx;
		margin: 0 0 0 30upx;
		outline: none;
		padding: 0 80upx;
		border: none;
		background-color: #ff402b;
		color: #fff;
		text-align: center;
		line-height: 68upx;
	}
}
</style>

<template>
	<view class="container">
		<!-- 确认订单 -->
		<!-- <view class="qrdd">
			<text>确认订单</text>
		</view> -->

		<!-- 订单内容 -->
		<view class="dd-content">
			<view class="dd-content-item" v-if="goodstype == 'chongzhi'">
				<image class="item-left" src="../../static/money.png" mode="aspectFit"></image>
				<view class="item-right">
					<view class="item-right-top">
						<text>余额充值</text>
						<text>￥{{ czmoney }}</text>
					</view>
					<view class="item-right-bottom"><text></text></view>
				</view>
			</view>
			<view class="dd-content-item" v-if="goodstype == 'vip'">
				<image class="item-left" src="../../static/user-vip.png" mode="aspectFit"></image>
				<view class="item-right">
					<view class="item-right-top">
						<text>{{ viptimeinfo.name }}</text>
						<text>￥{{ viptimeinfo.price }}</text>
					</view>
					<view class="item-right-bottom"><text></text></view>
				</view>
			</view>
			<view class="dd-content-item" v-if="goodstype == 'course'">
				<image class="item-left" :src="courseinfo.courseImgs" mode="aspectFit"></image>
				<view class="item-right">
					<view class="item-right-top">
						<text>{{ courseinfo.courseName }}</text>
						<text>￥{{ courseinfo.coursePrice }}</text>
					</view>
					<view class="item-right-bottom"><text>x1</text></view>
				</view>
			</view>
		</view>

		<!-- 订单备注 -->
		<view class="ddbz" v-if="goodstype == 'mall'">
			<text>订单备注</text>
			<textarea placeholder="在此填写您对本次交易的说明" @input="changeRemarks" />
		</view>

		<!-- 支付方式 -->
		<view class="zffs">
			<view class="zhifu-mode"><text>请选择支付方式</text></view>
			<radio-group @change="radioChange">
				<view class="zhifubao" v-for="(item, index) in items" :key="item.value">
					<view class="weixin-center" v-if="action != 'credit'">
						<image :src="item.icon" mode="aspectFit"></image>
						<text v-if="item.value != 'balance'">{{ item.name }}</text>
						<text v-if="item.value == 'balance'">{{ item.name }} (￥{{ balance }})</text>
					</view>
					<view class="weixin-center" v-if="action == 'credit'">
						<image :src="item.icon" mode="aspectFit"></image>
						<text>{{ item.name }} (当前积分:{{ userinfo.credit }})</text>
					</view>
					<label class="radio"><radio :value="item.value" :checked="index === current" /></label>
				</view>
			</radio-group>
		</view>

		<!-- 支付 -->
		<view class="pay" v-if="action == ''">
			<text>合计：</text>
			<text>￥{{ total }}</text>
			<!-- #ifdef MP-WEIXIN -->
			<button  open-type="getUserInfo"  @getuserinfo="getUserInfo" withCredentials="true">支付</button>
			<!-- #endif -->
			<!-- #ifndef MP-WEIXIN -->
			<button @click="pay">支付</button>
			<!-- #endif -->
		</view>
		
		
	</view>
</template>

<script>
import { checkUserinfo } from '@/request/checkUserinfo';
export default {
	data() {
		return {
			addressinfo: '',
			courseinfo: [],
			goodsinfo: [],
			pxcourse: [],
			shopcarlist: false,
			carlistdata: [],
			goodstype: 'course',
			total: 0,
			HOST_URL: '',
			current: 0,
			paytype: 'wxpay',
			menuid: '',
			sonid: '',
			yhm: '',
			remarks: '',
			shr_name: '',
			shr_phone: '',
			carlistdataid: '',
			postage: 0,
			items: [
				{
					value: 'wxpay',
					name: '微信支付',
					icon: '../../static/weixinzhifu.png'
				},
				/* {
					value: 'alipay',
					name: '支付宝支付',
					icon: '../../static/zhifubao.png'
				},
				{
					value: 'balance',
					name: '余额支付',
					icon: '../../static/money.png'
				} */
			],
			shoppingInfo: '',
			viptimeinfo: [],
			czmoney: 0,
			balance: '0.00',
			action: '', //判断传参行为
			creditinfo: {},
			userinfo: {},
			seckillinfo: {},
			pintuaninfo: {}
		};
	},
	onShareAppMessage(res) {
		let path = getCurrentPages();
		let path_share = path[0].$page.fullPath;
		let path_title = path[0].data.title;
		let userinfo = uni.getStorageSync('userinfo');
		let base_set = uni.getStorageSync('base_set');
		if (userinfo.uid == '' || !userinfo.uid) {
			uni.navigateTo({
				url: '../login/login'
			});
			return {
				title: '请先登录后再分享给好友',
				path: ''
			};
		} else {
			if (res.from === 'button') {
			}
			return {
				title: base_set.title,
				path: `${path_share}?pid=${userinfo.uid}`
			};
		}
	},
	onLoad(e) {
		this.goodstype = e.goodstype;
		this.HOST_URL = uni.HOST_URL;

		if (e.goodstype == 'course') {
			if (e.sonid) {
				this.sonid = e.sonid;
			}
			console.log('sonid ' + this.sonid);
			this.menuid = e.courseId;
			this.getCourseInfo(e.courseId, e.sonid);
			
		} else if (e.goodstype == 'vip') {
			this.getvipinfo(e.id);
		} else if (e.goodstype == 'chongzhi') {
			this.czmoney = e.czmoney;
			this.total = Number(e.czmoney);
			this.items.pop();
		}
	},
	onUnload() {
		this.menuid = '';
		this.sonid = '';
	},
	onShow() {
		checkUserinfo();
		const userinfo_check = uni.getStorageSync('userinfo');
		if (userinfo_check) {
			//账户余额
			// this.balance=userinfo_check.userdata.money
			this.userinfo = userinfo_check.userdata;
			//收货地址
			/* var checked_addressid=uni.getStorageSync('checked_addressid')
				if(checked_addressid!='' && checked_addressid!= null && checked_addressid){
					this.getaddress(checked_addressid)
				}else{
					this.getaddress('mr')
				} */
		}
	},
	methods: {
		getvipinfo(id) {
			const BASE_URL = uni.BASE_URL;
			uni.request({
				url: BASE_URL + 'index/vip/viptimeinfo',
				data: { id: id },
				method: 'POST',
				success: res => {
					this.viptimeinfo = res.data.data;
					this.total = parseFloat(res.data.data.price);
				},
				fail: res => {
					console.log(res.data);
				}
			});
		},

		changeName(e) {
			this.shr_name = e.detail.value;
		},
		changePhone(e) {
			this.shr_phone = e.detail.value;
		},
		changeRemarks(e) {
			this.remarks = e.detail.value;
		},

		navigate(e) {
			if (e == 'vip') {
				uni.switchTab({
					url: `/pages/${e}/${e}`
				});
			} else if (e == 'shipping-address') {
				uni.navigateTo({
					url: `/pages/${e}/${e}?orderpage=1`
				});
			} else {
				uni.navigateTo({
					url: `/pages/${e}/${e}`
				});
			}
		},
		radioChange: function(evt) {
			this.paytype = evt.target.value;
			console.log(this.paytype);
			for (let i = 0; i < this.items.length; i++) {
				if (this.items[i].value === evt.target.value) {
					this.current = i;
					break;
				}
			}
		},
		pay() {
			let userinfo = uni.getStorageSync('userinfo');
			const BASE_URL = uni.BASE_URL;

			if (this.paytype == '') {
				uni.showToast({
					title: '请选择支付方式',
					icon: 'none'
				});
				return false;
			}

			var data = {};
			if (this.goodstype == 'chongzhi') {
				data = {
					uid: userinfo.uid,
					pay_type: this.paytype,
					goodstype: this.goodstype,
					amount: this.total
				};
			} else if (this.goodstype == 'vip') {
				data = {
					uid: userinfo.uid,
					menuid: this.viptimeinfo.id,
					pay_type: this.paytype,
					goodstype: this.goodstype,
					amount: this.total
				};
			} else if (this.goodstype == 'course') {
				data = {
					userId: userinfo.uid,
					courseId: this.menuid,
					channelCode: "WX",
					goodsType: this.goodstype,
					amount: this.total,
				};
			}
			if (this.total == 0) {
			} else {
				if (this.paytype == 'wxpay') {
					// #ifdef  MP-WEIXIN
					data.openId = userinfo.openid;
					data.source = '3';
					uni.request({
						url: BASE_URL + 'api/pay/addOrder',
						header: {
						  'content-type': 'application/x-www-form-urlencoded'
						}, 
						data: data,
						method: 'POST',
						success: res => {
							let paydata = JSON.parse(res.data.data);
							uni.requestPayment({
								provider: 'wxpay',
								timeStamp: String(paydata.timeStamp),
								nonceStr: paydata.nonceStr,
								package: paydata.package,
								signType: paydata.signType,
								paySign: paydata.paySign,
								success: function(res) {
									console.log('success:' + JSON.stringify(res));
									uni.showToast({
										title: '支付成功！'
									});
									setTimeout(function() {
										uni.switchTab({
											url: '../user/user'
										});
									}, 800);
								},
								fail: function(err) {
									console.log('fail:' + JSON.stringify(err));
								}
							});
						},
						fail: res => {
							console.log(res.data);
						}
					});

					// #endif
					// #ifdef  APP-PLUS
					data.apptype = 'APP-PLUS';
					uni.request({
						url: BASE_URL + 'index/pay/order_make',
						data: data,
						method: 'POST',
						success: res => {
							console.log(res.data);
							let paydata = res.data.data;
							uni.requestPayment({
								provider: 'wxpay',
								orderInfo: paydata,
								success: function(res) {
									console.log('success:' + JSON.stringify(res));
									uni.showToast({
										title: '支付成功！'
									});
									setTimeout(function() {
										uni.switchTab({
											url: '../user/user'
										});
									}, 800);
								},
								fail: function(err) {
									console.log('fail:' + JSON.stringify(err));
								}
							});
						},
						fail: res => {
							console.log(res.data);
						}
					});
					// #endif
					// #ifdef H5
					var that = this;
					if (this.$jwx && this.$jwx.isWechat()) {
						data.openid = userinfo.openid;
						data.source = '3';
						data.apptype = 'H5';
						uni.request({
							url: BASE_URL + 'api/pay/webPay',
							data: data,
							header: {
							  'content-type': 'application/x-www-form-urlencoded'
							}, 
							method: 'POST',
							success: res => {
								if(res.data.code==200){
									let paydata = JSON.parse(res.data.data);
									this.$jwx.wxpay(paydata,
										function(res) {
											if (res.errMsg  == 'chooseWXPay:ok') {
												uni.request({
													url: BASE_URL + 'api/pay/queryOrder',
													data: {"outTradeNo":paydata.outTradeNo},
													header: {
													  'content-type': 'application/x-www-form-urlencoded'
													}, 
													method: 'POST',
													success: res => {
														let payResultdata = JSON.parse(res.data.data);
														uni.showToast({
															title: payResultdata.trade_state_desc
														});
														if(payResultdata.trade_state=='SUCCESS'){
															// 支付成功
															setTimeout(function() {
																uni.switchTab({
																	url: '../user/user'
																});
															}, 800);
														}
														
													}
												});
												
											}
											else {
												uni.showToast({
													title: '支付失败!',
													icon: 'none'
												});
											}
											
										}
									);
								}else{
									uni.showToast({
										title: '支付失败!',
										icon: 'none'
									});
								}
							},
							fail: res => {
								console.log(res.data);
							}
						});
					}
					// #endif
				}
				// wxpayend
				// balance
				else if (this.paytype == 'balance') {
					data.apptype = '';
					let balance = userinfo.userdata.money;
					if (Number(this.total) > Number(balance)) {
						uni.showToast({
							title: '余额不足,请充值！',
							icon: 'none'
						});
						// setTimeout(function(){
						// 	uni.switchTab({
						// 		url:'../user/user'
						// 	})
						// },1000)
					} else {
						uni.request({
							url: BASE_URL + 'index/pay/order_make',
							data: data,
							method: 'POST',
							success: res => {
								console.log(res.data);
								if (res.data.code == 0) {
									uni.showToast({
										title: '支付成功！'
									});
									setTimeout(function() {
										uni.switchTab({
											url: '../user/user'
										});
									}, 1000);
								}
							},
							fail: res => {
								console.log(res.data);
							}
						});
					}
				}
				// balance pay end
				// alipay start
				else if (this.paytype == 'alipay') {
					// #ifdef  H5
					data.apptype = 'H5';
					uni.request({
						url: BASE_URL + 'index/pay/order_make',
						data: data,
						method: 'POST',
						success: res => {
							let divForm = document.getElementsByTagName('divform');
							if (divForm.length) {
								document.body.removeChild(divForm[0]);
							}
							const div = document.createElement('divform');
							div.innerHTML = res.data.body;
							document.body.appendChild(div);
							document.getElementById('alipaysubmit').submit();
						},
						fail: res => {
							console.log(res.data);
						}
					});
					// #endif
					// #ifdef  APP-PLUS
					data.apptype = 'APP-PLUS';
					uni.request({
						url: BASE_URL + 'index/pay/order_make',
						data: data,
						method: 'POST',
						success: res => {
							let paydata = res.data.body;
							uni.requestPayment({
								provider: 'alipay',
								orderInfo: paydata,
								success: function(res) {
									uni.showToast({
										title: '支付成功！'
									});
									setTimeout(function() {
										uni.switchTab({
											url: '../user/user'
										});
									}, 800);
								},
								fail: function(err) {
									console.log('fail:' + JSON.stringify(err));
								}
							});
						},
						fail: res => {
							console.log(res.data);
						}
					});
					// #endif
				}
			}
		},
		getCourseInfo(menuid, sonid) {
			const BASE_URL = uni.BASE_URL;
			uni.request({
				url: BASE_URL + 'api/knowledge/getCourseById',
				data: {
					courseId: menuid
				},
				method: 'POST',
				success: res => {
					console.log(res.data);
					if (res.data.code == 200) {
						this.courseinfo = res.data.data;
						this.total = parseFloat(this.courseinfo.coursePrice) * 1;
					}
				},
				fail: res => {
					console.log(res.data);
				}
			});
		},
		getUserInfo() {
			var that = this;
			uni.getUserInfo({
				  provider: 'weixin',
				  success: function (infoRes) {
					uni.login({
					  provider: 'weixin',
					  success: function (loginRes) {
						console.log(loginRes);
						const BASE_URL=uni.BASE_URL
						const code=loginRes.code
						uni.request({
							url: BASE_URL+'api/wx/getUserInfo',  
							 header: {
							  'content-type': 'application/x-www-form-urlencoded'
							}, 
							data: {
								code:code								
							},
							method:'POST',
							success:(res) =>{
								console.log(res.data);
								let openid=res.data.data.openid
								let unionid=res.data.data.unionid
								
								var userinfo=uni.getStorageSync('userinfo');
								userinfo.openid = openid;
								uni.setStorageSync('userinfo',userinfo);
								that.pay();
							},
							fail:(res)=> {
								console.log(res.data);
							}
						});
					
					  }
					});
				  }
				});
		},
		
		
	}
};
</script>
